layui.use(['table','form', 'layedit', 'laydate','jquery','laypage'], function () {
    var table = layui.table
        ,form = layui.form
        ,layer = layui.layer
        ,layedit = layui.layedit
        ,laydate = layui.laydate
        ,$ = layui.jquery
        ,laypage = layui.laypage;
    //监听表格复选框选择
    table.on('checkbox(demo)', function (obj) {
        console.log(obj)
    });
    //监听工具条
    table.on('tool(demo)', function (obj) {
        var data = obj.data;
        if (obj.event === 'detail') {
            layer.msg('ID：' + data.id + ' 的查看操作');
        } else if (obj.event === 'del') {
            layer.confirm('真的删除行么', function (index) {
                obj.del();
                layer.close(index);
            });
        } else if (obj.event === 'edit') {
            layer.alert('编辑行：<br>' + JSON.stringify(data))
        }
    });

    var $ = layui.$, active = {
        getCheckData: function () { //获取选中数据
            var checkStatus = table.checkStatus('idTest')
                , data = checkStatus.data;
            layer.alert(JSON.stringify(data));
        }
        , getCheckLength: function () { //获取选中数目
            var checkStatus = table.checkStatus('idTest')
                , data = checkStatus.data;
            layer.msg('选中了：' + data.length + ' 个');
        }
        , isAll: function () { //验证是否全选
            var checkStatus = table.checkStatus('idTest');
            layer.msg(checkStatus.isAll ? '全选' : '未全选')
        }
    };

    $('.demoTable .layui-btn').on('click', function () {
        var type = $(this).data('type');
        active[type] ? active[type].call(this) : '';
    });


    $('#add').on('click',function () {
        layer.open({
            type: 2,
            title: ['添加用户', 'font-size:13px;margin-top:10px;text-align:center'],
            content: ctx+'/user/addUserPage.do',//con是Ajax返回的页面
            // btn: ['确定', '取消'],
            area: ['400px', '350px'],
            shade: false,
            maxmin: true,
            anim: 2,

        })
    });



    Vue.filter("roleText", function(vlaue) {
        var role ="";
        if(vlaue==0){
            role="普通用户";
        }
        if(vlaue==1){
            role="管理员";
        }
        if(vlaue==2){
            role="超级管理";
        }
        return role;
    });
    Vue.filter("statusText", function(value){
        var status;
        if(value==0){
            status="正常";
        }else {
            status ="冻结";
        }
        return status;
    })
    var user = new Vue({
        el: '#user-list',
        data: {
            list: [],
        },
        methods:{
            frozenUser:function (id) {
                layer.open({
                    title: ['操作提示'],
                    content: '<div style="color:#767676">冻结该账号后，用户将不可登录。<br/>是否冻结？</div>',
                    btn: ['确定', '取消'],
                    shadeClose: false,
                    //回调函数
                    yes: function(index, layero){
                        $.ajax({
                            type: "post",
                            url: ctx+"/user/frozenUser.do?id="+id,
                            // contentType: "application/json",
                            async: false,
                            // data: JSON.stringify(data.field),
                            success: function (res) {
                                layer.close()
                                if (res.resultCode == 10000) {
                                    layer.close(index);
                                    layer.msg(res.msg, {icon: 1});
                                    fisrtLoadData();
                                } else {
                                    layer.msg(res.msg, {icon: 2});
                                }
                            },
                        });
                    },
                    btn2: function(index, layero){
                        layer.close();//取消按钮
                    },
                    cancel: function(index,layero){ //按右上角“X”按钮
                        layer.close();
                    },

                });
            },
            cancelFrozenUser:function (id) {
                layer.open({
                    title: ['操作提示'],
                    content: '<div style="color:#767676">是否恢复该账户？</div>',
                    btn: ['是', '否'],
                    shadeClose: false,
                    //回调函数
                    yes: function(index, layero){
                        $.ajax({
                            type: "post",
                            url: ctx+"/user/cancelFrozenUser.do?id="+id,
                            // contentType: "application/json",
                            async: false,
                            // data: JSON.stringify(data.field),
                            success: function (res) {
                                layer.close()
                                if (res.resultCode == 10000) {
                                    layer.close(index);
                                    layer.msg(res.msg, {icon: 1});
                                    fisrtLoadData();
                                } else {
                                    layer.msg(res.msg, {icon: 2});
                                }
                            },
                        });
                    },
                    btn2: function(index, layero){
                        layer.close();//取消按钮
                    },
                    cancel: function(index,layero){ //按右上角“X”按钮
                        layer.close();
                    },

                });
            },
            resetPassword:function (user) {
                layer.open({
                    title: ['操作提示'],
                    content: '<div style="color:#767676">是否确认重置密码？</div>',
                    btn: ['是', '否'],
                    shadeClose: false,
                    //回调函数
                    yes: function(index, layero){
                        $.ajax({
                            type: "post",
                            url: ctx+"/user/resetPassword.do",
                            contentType: "application/json",
                            async: false,
                            data: JSON.stringify(user),
                            success: function (res) {
                                layer.close()
                                if (res.resultCode == 10000) {
                                    layer.close(index);
                                    layer.msg("密码重置成功", {icon: 1});
                                    fisrtLoadData();
                                } else {
                                    layer.msg("重置密码失败", {icon: 2});
                                }
                            },
                        });
                    },
                    btn2: function(index, layero){
                        layer.close();//取消按钮
                    },
                    cancel: function(index,layero){ //按右上角“X”按钮
                        layer.close();
                    },

                });
            }
        }
    });

    fisrtLoadData();

    function fisrtLoadData() {
        var url = "listPage.do";
        var config = {page:1,pageSize:6};
        $.getJSON(url,config,function(res){
            laypage.render({
                elem: 'page',
                count: res.total, //总条数
                limit:config.pageSize, //每页条数
                // theme: '#FFB800', //自定义颜色
                jump: function(obj, first){
                    if(!first){ //首次则不进入
                        config.page = obj.curr;
                        getUserListByPage(url,config);
                    }
                }
            });
            user.list = res.rows;
        });
    }


    //点击页数从后台获取数据
    function getUserListByPage(url,config){
        $.getJSON(url,config,function(res){
            user.list = res.rows;
        });
    }

});
